<template>
  <div class="left-chart-3">
    <div class="lc3-header">
      产季累积降水
    </div>
    <div class="">
      <!-- <dv-charts :option="lineOptions" style="height: 300px;"/> -->
    </div>

  </div>
</template>

<script lang="ts" setup>
const lineOptions = {
  title: {
    text: '周销售额趋势'
  },
  xAxis: {
    name: '第二周',
    data: ['周一', '周二', '周三', '周四', '周五', '周六', '周日']
  },
  yAxis: {
    name: '销售额',
    data: 'value'
  },
  series: [
    {
      data: [1200, 2230, 1900, 2100, 3500, 4200, 3985],
      type: 'line',
      lineArea: {
        show: true
      }
    }
  ]
}

</script>

<style lang="scss" scoped>
.left-chart-3 {
  width: 100%;
  height: 35%;
  display: flex;
  flex-direction: column;

  .lc3-header {
    height: 20px;
    line-height: 20px;
    font-size: 16px;
    text-indent: 20px;
    margin-top: 5px;
  }

  .lc3-details {
    height: 40px;
    font-size: 16px;
    display: flex;
    align-items: center;
    text-indent: 20px;

    span {
      color: #096dd9;
      font-weight: bold;
      font-size: 35px;
      margin-left: 20px;
    }
  }

  .lc3-chart {
    flex: 1;
  }
}
</style>
